<html>
<head>
<script type="text/javascript" src="./jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="./jquery-ui-1.8.9.custom.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $.get("http://localhost:8085/poc/json.htm",handleJson,"html");
});
var obj;

function handleJson(data){
	var lang = '';
	obj = $.parseJSON(data);
	printReviews();
	alert('Going to remove divs now');
	$('.reviews').remove();
	alert('Feeling empty now,huh, sorting on basis on id');
	obj.sort(sortByName);
	printReviews();
	alert('Going to remove divs now');
	$('.reviews').remove();
	alert('Feeling empty now,huh, printing only pete');
	printReviews('name','Pete');
}

function printReviews(){
	var foo = document.getElementById("abc");
	var newfoo = document.createElement("div");
	newfoo.setAttribute("class","reviews");
	foo.appendChild(newfoo);
	
	$.each(obj, function() {
		var element = document.createElement("div");
		var text = document.createTextNode("name " + this['name']);
	    element.appendChild(text);
		newfoo.appendChild(element);
		//lang += "Name " + this['name'] + "  ";
	});
}

function printReviews(property,value){
	var foo = document.getElementById("abc");
	var newfoo = document.createElement("div");
	newfoo.setAttribute("class","reviews");
	foo.appendChild(newfoo);
	
	$.each(obj, function() {
		var name = this[property];
		if(name == value){
			var element = document.createElement("div");
			var text = document.createTextNode("name " + this['name']);
			element.appendChild(text);
			newfoo.appendChild(element);
		}
	});
}


function sortByID(x,y) {
      return x.id - y.id; 
}


function sortByName(x,y) {
      return ((x.name == y.name) ? 0 : ((x.name > y.name) ? 1 : -1 ));
}
</script>
</head>
<body>
<div id="abc"></div>
<form name="addR" onsubmit="sortAndSelect()">
Name: <select name="gender" id="genderId">
			<option value="M">Male</option>
			<option value="F">Female</option>
		</select>
Sort By : <input type="text" id="sortId"/>
<input type="submit" Value="Submit">
</form>
</body>
</html>
